<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>websocket test</title>
</head>
<style type="text/css">
    h3,h4{
        text-align:center;
    }
</style>
<body>
    <h3>WebSocket测试，在<span style="color:red">控制台</span>查看测试信息输出！</h3>

    <h4>
        [url=/websocket/sendOne?message=单发消息内容&id=none]单发消息链接[/url]
        [url=/websocket/sendAll?message=群发消息内容]群发消息链接[/url]
    </h4>


    <script type="text/javascript">
        var socket;
        if (typeof (WebSocket) == "undefined") {
            console.log("遗憾：您的浏览器不支持WebSocket");
        } else {
            console.log("恭喜：您的浏览器支持WebSocket");

            //实现化WebSocket对象
            //指定要连接的服务器地址与端口建立连接
            //注意ws、wss使用不同的端口。我使用自签名的证书测试，
            //无法使用wss，浏览器打开WebSocket时报错
            //ws对应http、wss对应https。
            socket = new WebSocket("ws://localhost:8080/");
            //连接打开事件
            socket.onopen = function() {
                console.log("Socket 已打开");
                socket.send("消息发送测试(From Client)");
            };
            //收到消息事件
            socket.onmessage = function(msg) {
                console.log(msg.data);
            };
            //连接关闭事件
            socket.onclose = function() {
                console.log("Socket已关闭");
            };
            //发生了错误事件
            socket.onerror = function() {
                alert("Socket发生了错误");
            }

            //窗口关闭时，关闭连接
            window.unload=function() {
                socket.close();
            };
        }
    </script>
</body>
</html>